$(function () {

	commTemplUtil.initPage();
	commTemplUtil.initCommLeftMemu();

	// 选择主营品牌;
	$("#brand-btn").on("click",
		function () {
		if (typeof PAGE_DATA.modalBrandData == 'undefined') {
			$.ajax({
				url : PAGE_CONFIG.requestUrl.asbrandUrl,
				type : 'get',
				dataType : 'json',
				success : function (result) {
					PAGE_DATA.modalBrandData = $.extend([], result.data);
					CreateModalBrand(PAGE_DATA.modalBrandData).showModal();
				},
				error : function (xhr, status, error) {
					CreateModalBrand([]).showModal();
				}
			});
		} else {
			CreateModalBrand(PAGE_DATA.modalBrandData).showModal();
		}
	});

	// 表单验证.
	$("#supplier_center").validate({
		rules : {
			name : "required",
			chose_banner : "required",
			chose_shop_banner : "required",
			county_id : "required",
			sell_status : "required",
			original_price : {
				required : true,
				number : true,
			},
			stock : {
				required : true,
				digits : true,
			},
			minimum_order : {
				required : true,
				digits : true,
			},
			cn : {
				required : true
			},
			weight : {
				required : true,
				number : true,
			},
			display : "required",
			recommend_status : "required",
			gender : "required",
		},
		messages : {
			shop_name : "必填项",
			display : "必选项",
			chose_shop_banner : "请选择一个商品品牌",
			shop_namew : "请选择一个小的的类别",
			adress : "请选择一个地区",
			number : "请输入一个整数",
			company : "请输入您的单位名称"
		},
		errorPlacement : function (error, element) {
			if (element.attr("name") == "signflag") {
				element.parents(".electronic-bottom").append(error);
			} else {
				element.parents(".add-right-r").after($("<div class='key-lbl <lh32></lh32>' style='width:auto;'/>").append(error));
			}
		},

	});
	var addrTemplObj = _.template($('#addr-option-templ').html());
	renderPage();

	function renderPage() {
		// 省
		$.ajax({
			url : PAGE_CONFIG.requestUrl.addrProvince,
			type : 'get',
			dataType : 'json',
			success : function (result) {
				var datas = $.extend([], result.data);
				var tmplObjHtml = addrTemplObj(datas);
				$("#province_id").html(tmplObjHtml);

				$("#province_id").on("change",
					function () {
					var code = $(this).val();
					renderAddrCity(code);
				});

				if (!!PAGE_DATA.addrDefault) {

					setDefaulAddr("province_id", PAGE_DATA.addrDefault.province_id || "");
				}

			},
			error : function (xhr, status, error) {
				var tmplObjHtml = addrTemplObj([]);
				$("#province_id").html(tmplObjHtml);
			}
		});
	};

	function renderAddrCity(provinceCode) {

		// 市
		$.ajax({
			url : PAGE_CONFIG.requestUrl.addrCity,
			type : 'post',
			dataType : 'json',
			data : {
				code : provinceCode,
				_token : COMM_DATA.csrfToken
			},
			success : function (result) {
				var datas = $.extend([], result.data);
				var tmplObjHtml = addrTemplObj(datas);
				$("#city_id").html(tmplObjHtml);
				$("#city_id").on("change",
					function () {
					var code = $(this).val();
					renderAddrCounty(code);
				});

				if (!!PAGE_DATA.addrDefault) {
					setDefaulAddr("city_id", PAGE_DATA.addrDefault.city_id || "");
				}

			},
			error : function (xhr, status, error) {
				var tmplObjHtml = addrTemplObj([]);
				$("#city_id").html(tmplObjHtml);
			}
		});

		$("#city_id").empty().html(addrTemplObj([]));
		$("#county_id").empty().html(addrTemplObj([]));
	};

	function renderAddrCounty(cityCode) {
		// 区/县
		$.ajax({
			url : PAGE_CONFIG.requestUrl.addrCounty,
			type : 'post',
			dataType : 'json',
			data : {
				code : cityCode,
				_token : COMM_DATA.csrfToken
			},
			success : function (result) {
				var datas = $.extend([], result.data);
				var tmplObjHtml = addrTemplObj(datas);
				$("#county_id").html(tmplObjHtml);

				if (!!PAGE_DATA.addrDefault) {
					setDefaulAddr("county_id", PAGE_DATA.addrDefault.county_id || "");
				}
			},
			error : function (xhr, status, error) {
				var tmplObjHtml = addrTemplObj([]);
				$("#county_id").html(tmplObjHtml);
			}
		});
	};

	var classifyTemplObj = _.template($('#classify-templ').html());
	goodsClassify();

	function goodsClassify() {
		$.ajax({
			url : PAGE_CONFIG.requestUrl.goodsclassify,
			type : "get",
			dataType : 'json',
			success : function (result) {
				var datas = $.extend([], result.data);
				var tmplObjHtml = classifyTemplObj(datas);
				$("#class_id").html(tmplObjHtml);
			},
			error : function (xhr, status, error) {
				var tmplObjHtml = classifyTemplObj([]);
				$("#class_id").html(tmplObjHtml);
			}
		})
	};

	storeClassify();

	function storeClassify() {
		$.ajax({
			url : PAGE_CONFIG.requestUrl.storeClassification,
			type : "get",
			dataType : 'json',
			success : function (result) {
				var datas = $.extend([], result.data);
				var tmplObjHtml = classifyTemplObj(datas);
				$("#category_id").html(tmplObjHtml);
			},
			error : function (xhr, status, error) {
				var tmplObjHtml = classifyTemplObj([]);
				$("#category_id").html(tmplObjHtml);
			}
		});
	};

	function setDefaulAddr(domId, value) {
		$("#" + domId).val(value).trigger("change");

	};

	// 选择文件
	$("#regist-elec-docs").on("click", ".upload-img",
		function () {
		var fileObj = $(this).find("[type='file']");
		fileObj[0].click();
	});

	// 零时预览图片,
	$("#regist-elec-docs").find("[type='file']").each(function () {
		$(this).AjaxFileUpload({
			action : PAGE_CONFIG.requestUrl.uploadimg,
			name : PAGE_CONFIG.requestUrl.preViewImg,
			onComplete : function (filename, response) {
				$(this).parent().find("img").attr("src", response.data);
			}
		});
	});

	// 开启规格-按钮
	$("#open_spec1").click(function () {
		getSpecData();
	});
	
	// 打开规格-按钮
	$("#reopen_spec").click(function () {
		renderEditSpec(PAGE_DATA.spec_data);
	});

});

function getSpecData() {
	
	// 缓存规格数据
	PAGE_DATA.spec_data = null;
	PAGE_DATA.spec_old_data = null;
	
	// 获取已存在的 规格记录ID;
	var specIds = $.extend([], PAGE_DATA.specIds);

	// 读取 规格信息.
	$.ajax({
		url : PAGE_CONFIG.requestUrl.goodsSpecS17Read,
		type : "get",
		dataType : 'json',
		data : {
			specids : specIds,
		},
		success : function (result) {
			PAGE_DATA.spec_old_data = $.extend({}, result.data);
			renderEditSpec(result.data);
		},
		error : function (xhr, status, error) {}
	});
};

function renderEditSpec(data) {

	// 编辑商品规格-弹出框模板
	var editSpecTempl = _.template($('#edit-spec-templ').html());
	
	
	if ($("[id='content:open_spec2_dialog']").length > 0) {
		// 点击删除时，重新渲染 规格数据;

		var dialogObj = $("[id='content:open_spec2_dialog']");
		var dataContain = $("#add_spec_1");

		bindSpecList(data, dialogObj, dataContain);
		return false;
	}

	var dial = dialog({
			width : 720,
			id : "open_spec2_dialog",
			title : "编辑商品规格",
			content : editSpecTempl,
			onshow : function () {

				var that = this;
				var dialogObj = $("[id='content:open_spec2_dialog']");
				var dataContain = $("#add_spec_1");

				//  单条规格记录模板
				var goodSpecTempl = _.template($('#good-spec-templ').html());
				var emptyGoodSpec = goodSpecTempl([{
								id : "",
								spec_1 : "",
								spec_2 : "",
								spec_3 : "",
								spec_4 : "",
								spec_5 : "",
								price : "",
								stock : "",
								articleNum : ""
							}
						]);

				bindSpecList(data, dialogObj, dataContain);

				//添加新的规格,只绑定一次
				$("#add_spec").click(function () {

					if (dataContain.children().length <= 3) {
						dataContain.append(emptyGoodSpec);
						bindNewSpec(dataContain.find(".disnone").last());
					} else {
						$(this).append("<span style='color:red;' >！！每种商品最多只能有[四种]规格!!</span>");
					}

				});

				// 保存规格
				$("#sel-keep-btn").click(function () {

					// 保存数据到 缓存, TODO,
					PAGE_DATA.spec_data = {
						specName : [],
						specData : []
					};
					
					$("#spec-title").find("input").each(function(){
						PAGE_DATA.spec_data.specName.push($(this).val());
					});
					
					dataContain.find("ul").each(function () {
						var dataItem = {};
						var inputObjs = $(this).find("input");
						
						dataItem.id = inputObjs.eq(0).val();
						dataItem.spec_1 = inputObjs.eq(1).val();
						dataItem.spec_2 = inputObjs.eq(2).val();
						dataItem.spec_3 = inputObjs.eq(3).val();
						dataItem.spec_4 = inputObjs.eq(4).val();
						dataItem.spec_5 = inputObjs.eq(5).val();
						dataItem.price = inputObjs.eq(6).val();
						dataItem.stock = inputObjs.eq(7).val();
						dataItem.articleNum = inputObjs.eq(8).val();
						
						PAGE_DATA.spec_data.specData.push(dataItem);
					});
					
					var flag = _.isEqual(PAGE_DATA.spec_data, PAGE_DATA.spec_old_data);
					
					if (!flag) {
						// 如果数据有变动,
						$("#open_spec1").hide();
						$("#reopen_spec").show();
						// 复制 标签 以备 表单提交;
						$("#specs-form").html($("#spec-title").clone().attr("id","")).append(dataContain.clone().attr("id", ""));
					}
					
					that.remove();
				});

			}
		});
	dial.showModal();
};

/**
 * 给 弹出框规格 绑定事件。
 */
function bindSpecList(data, dialogObj, dataContain) {

	//  单条规格记录模板
	var goodSpecTempl = _.template($('#good-spec-templ').html());

	// 打开"编辑商品规格"时，渲染 数据库已有的 规格数据.
	if (!!data.specData) {
		dataContain.html(goodSpecTempl(data.specData));
	}

	//  渲染 规格名
	if (!!data.specName && data.specName.length > 0) {
		var nameAry = data.specName;
		dialogObj.find("#spec-title").find("input").each(function (i) {
			$(this).val(nameAry[i]);
		});
	}

	dialogObj.parent().attr("style", "padding:0px");

	// 上移
	dialogObj.find("i.icon-arrow-up").on("click", function () {
		var ulObj = $(this).parents(".disnone");
		var preUlObj = ulObj.prev();
		if (preUlObj.length > 0) {
			ulObj.after(preUlObj)
		}
	});

	// 下移
	dialogObj.find("i.icon-arrow-down").on("click", function () {
		var ulObj = $(this).parents(".disnone");
		var nextUlObj = ulObj.next();
		if (nextUlObj.length > 0) {
			nextUlObj.after(ulObj)
		}
	});

	// 删除, icon-remove
	dialogObj.find("i.icon-remove").on("click", function () {
		var ulObj = $(this).parents(".disnone");
		var specId = ulObj.find("input[data-type='spec-id']").val();

		if (!!specId) {
			delteSpec(specId);
		} else {
			ulObj.remove();
		}

	});

};

/**
 * 添加新的规格属性时，绑定 上移,下移,删除;
 */
function bindNewSpec(ulObj) {
	// 上移
	ulObj.find("i.icon-arrow-up").on("click", function () {
		var ulObj = $(this).parents(".disnone");
		var preUlObj = ulObj.prev();
		if (preUlObj.length > 0) {
			ulObj.after(preUlObj)
		}
	});
	// 下移
	ulObj.find("i.icon-arrow-down").on("click", function () {
		var ulObj = $(this).parents(".disnone");
		var nextUlObj = ulObj.next();
		if (nextUlObj.length > 0) {
			nextUlObj.after(ulObj)
		}
	});
	// 删除, icon-remove
	ulObj.find("i.icon-remove").on("click", function () {
		var ulObj = $(this).parents(".disnone");
		var specId = ulObj.find("input[data-type='spec-id']").val();

		if (!!specId) {
			delteSpec(specId);
		} else {
			ulObj.remove();
		}

	});
};

/*
 * 删除"编辑商品规格"
 */
function delteSpec(specId) {
	
	// 读取 规格信息.
	$.ajax({
		url : PAGE_CONFIG.requestUrl.goodsSpecS17Del,
		type : "delete",
		dataType : 'json',
		data : {
			specid : specId,
			_token : COMM_DATA.csrfToken
		},
		success : function (result) {
			renderEditSpec(result.data);
		},
		error : function (xhr, status, error) {}
	});
};

/*
 * 主营品牌
 */
function CreateModalBrand(data) {
	var tmplObj = _.template($('#item-template').html());
	var tmplObjHtml = tmplObj(data);

	// 模态框, 选择主营类别
	var dial = dialog({
			id : "dialog-brand",
			width : 550,
			height : 400,
			title : "选择品牌",
			content : tmplObjHtml,
			onshow : function () {

				var that = this;
				// bind event
				var dialogObj = $("[id='content:dialog-brand']");
				dialogObj.find(".info-item").on("click",
					function () {
					var id = $(this).attr("id");
					var start = id.lastIndexOf("-");
					var idx = id.substr(start + 1);
					$(this).addClass("hover").siblings().removeClass("hover");
					$("#info-detail-box-" + idx).show().siblings().hide();
				});
				$("#modal-save-btn").bind("click",
					function () {
					var radiObj = $("[id='checked_radio']").find(":checked");
					var getsrc = radiObj.attr("imgsrc");
					var getId = radiObj.attr("code");
					if (getsrc) {
						var htmlSrc = "<img src=" + getsrc + ">";
						$("#choose_banner").show();
						$("#chose_banner").attr("value", getId);
						$("#imgsrc").html(htmlSrc);
						that.close();
					} else {
						alert("请选择一个商品品牌");
					};

				});

				// 初始化 显示设定;
				$("#info-item-title-0").addClass("hover");
				$("#info-detail-box-0").show();
			}

		});

	return dial;
};